<template>
	<view class="content">
		<view class="topNav">
			<view class="topNav" style="margin:0 -32rpx ;padding32rpx ;height: 90rpx;">
				<div class="cuIcon-back icon left" @click="back"></div>
				<div class="center">我的成绩</div>
			</view>
		</view>
		<div style="width: 100%;height: 90rpx;"></div>
		<div class='dataCont'>
			<div class='item' v-for='(item,index) in data' :key='index'>
				<div class='left'>
					<div class='title'>{{item.name}}</div>
					<div><span style='color: #E63C3C;margin-right:10rpx;font-size: 28rpx;font-weight: bold;'> {{item.passing_rate}}分 </span> 共{{item.nums}}题 &nbsp; 正确{{item.success_num}}题 </div>
				</div>
				<div class='right' @click='toNext(item)'>查看</div>
			</div>
		</div>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: [],
				count:0,
				page_index:1,
				page_num:10,
			}
		},
		onLoad() {
			//console.log('e==入参===')
		},
		onShow() {
			this.init()
			//console.log('执行了onShow')
		},
		mounted() {},
		onReachBottom() {
			//console.log(this.count/this.page_index)
			if (this.count/this.page_index>this.page_num) {
				this.page_index++;
				this.getData();
				//console.log('加载更多');
			} else {
				//console.log('没有更多了');
			}
		},
		methods: {
			init(){
				this.page_index=1
				this.page_num=10
				this.data=[]
				this.count=0
				this.getData()
			},
			back() {
				// uni.navigateBack()
				uni.navigateTo({
					url: `/pages/index/index?type=4`
				});
			},
			getData() {
				let _this = this;
				_this.uniRequest({
					url: `/my/achievement`,
					method: 'post',
					data: {
						page_index: _this.page_index,
						page_num: _this.page_num
					},
					success: res => {
						//console.log('返回值', res);
						if (res.code == 200) {
							this.data = this.data.concat(res.data.answer_statistics);
							this.count = res.data.count||0
						}
					},
				});
			},
			toNext(item) {
				uni.navigateTo({
					url: `/pages/course/complete?classroom_practice_id=${item.classroom_practice_id}&exam_no=${item.exam_no}`
				});
			},
		}
	}
</script>

<style lang='less' scoped>
	.content {
		min-height: 100vh;
		background-color: #eee7e5;
		.topNav {
			background: #a67000;
			color: white;
			background: #fffaf0;
			color: #000000;
		}

		.dataCont {
			padding: 32rpx;

			.item {
				padding: 32rpx;
				background: #fffefa;
				border-radius: 12rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				line-height: 48rpx;
				box-sizing: border-box;
				margin-bottom: 32rpx;

				.left {
					max-width: calc(100% - 160rpx);
					font-size: 24rpx;
					font-weight: normal;
					color: #646972;
					.title {
						font-size: 30rpx;
						font-weight: bold;
						color: #575C65;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						box-sizing: border-box;
					}
				}

				.right {
					width: 140rpx;
					background: white;
					border: 1px solid #a67000;
					border-radius: 12rpx;
					font-size: 24rpx;
					font-weight: normal;
					color: #a67000;
					line-height: 56rpx;
					text-align: center
				}
			}
		}
	}
</style>
